<template>
<view class="sex-picker">
	<view class="sex-picker-item text-color1 bottom-divider" @click="emits('onConfirm')">
		我是男的
	</view>
	<view class="sex-picker-item text-color1 bottom-divider" @click="emits('onConfirm')">
		我是女的
	</view>
	<view class="sex-picker-item text-color1" @click="emits('onConfirm')">
		保密
	</view>
	<view class="divider"></view>
	<view class="sex-picker-item text-color2" @click="emits('onCancel')">
		取消
	</view>
</view>
</template>

<script setup>
const emits = defineEmits(['onCancel', 'onConfirm'])
</script>

<style lang="scss">
.sex-picker {
	.sex-picker-item {
		height: 96rpx;
		min-height: 96rpx;
		// color: $text-color1;
		font-size: 32rpx;
		line-height: 96rpx;
		text-align: center;
	}
	.bottom-divider {
		border-bottom: 1px solid $divider-color;
	}
	.divider {
		height: 16rpx;
		min-height: 16rpx;
	}
}
</style>